<template>
	<view>
		<view class="titleBg d-flex-yCenter-sb pg-30">
			<text class="font-32 textColor-white">限时秒杀</text>
			<image src="../static/miaoshabg.png" class="mr-30" style="width: 136rpx;height: 130rpx;" mode=""></image>
		</view>
		<view class="bodys pb-30 px-30">
			<navigator 
				class="d-flex  py-30 border-b items" 
				hover-class="none"
				:url="'/pages/prot_details/prot_details?cid='+item.goods_id" 
				v-for="(item,index) in data" :key='index'>
				<view class="" style="font-size: 0;">
					<image :src="item.logo"  mode="aspectFill"></image>
				</view>
				<view class="flex-grow1 d-flex flex-d jfy-sb ml-20">
					<view class="d-flex flex-d">
						<text class="font-30 text-overflow2">{{item.title}}</text>
						<!-- <text class="font-24 mt-20" style="color: #666666;">哇哈哈</text> -->
					</view>
					<view class="d-flex jfy-sb">
						<view class="d-flex " style="align-items: flex-end;">
							<view class="">
								<text class="font-24">秒杀价：</text>
								<text class="font-32 ">{{item.price_selling}}</text>
							</view>
							<text style="color: #666666;" class="font-24 ml-20 text-delete-d">￥{{item.price_market}}</text>
						</view>
						<view class="btn">立即秒杀</view>
					</view>
				</view>
			</navigator>
		</view>
	</view>
</template>

<script>
	import { http_mall_activity_goods_seckill_lts} from '@/config/apiRouter.js'
	export default {
		data() {
			return {
				page:1,
				data:[],
				laz_page:null
			}
		},
		onLoad() {
			this.getData()
		},
		onReachBottom() {
			if(this.page==this.laz_page || this.laz_page==0)return
			this.page++
			this.getData(true)
		},
		methods: {
			getData(type){
				http_mall_activity_goods_seckill_lts({
					data:{
						limit:4,
						page:this.page
					}
				}).then(res=>{
					this.laz_page=res.data.last_page
					type?this.data=this.data.concat(res.data.data):this.data=res.data.data
				})
			}
		}
	}
</script>

<style lang="scss">
.titleBg{
	height: 150rpx;
	background: #F58D07;
}
.bodys{
	background: #fff;
	border-radius: 20rpx 20rpx 0 0;
	position: relative;
	top: -20rpx;
	height: 500rpx;
	.items{
		image{
			width: 200rpx;
			height: 200rpx;
			border-radius: 20rpx;
		}
		.btn{
			width: 150rpx;
			line-height: 60rpx;
			text-align: center;
			color: #fff;
			font-size: 24rpx;
			background: linear-gradient(135deg, #F58D07, #FFAF49);
			border-radius: 30rpx;
		}
	}
}
</style>
